<template>
  <div class='container'>
    <el-dialog
      title="预览文章"
      :visible="dialogVisible"
      @close="closegb"
      width="60%"
    >
    <el-form ref="form" :model="FormData">
      <el-form-item>
       <span class="title">{{FormData.title}}</span>
      </el-form-item>
      <el-form-item>
       {{parseTime(FormData.createTime)}}
       {{`超级管理员`}}
       <i class="el-icon-view"></i>
       {{yulancishu}}
      </el-form-item>
      <el-form-item>
       {{html2Text(FormData.articleBody)}}
      </el-form-item>
    </el-form>
     </el-dialog>
  </div>
</template>

<script>
import { html2Text, parseTime } from '@/utils/index.js'
export default {
  name: 'articlesPreview',
  props: {
    dialogVisible: {
      type: Boolean
    },
    // 表单数据
    previewData: {
      type: Object,
      default: () => {}
    },
    // 次数
    count: {
      type: Number
    },
    yulancishu: {
      type: Number
    }
  },
  data () {
    return {
      FormData: {}
    }
  },
  methods: {
    // 关闭回调
    closegb () {
      this.$emit('closegb')
    },
    // 格式化时间
    parseTime (a) {
      return parseTime(a)
    },
    // 格式化标签
    html2Text (a) {
      return html2Text(a)
    }
  },
  watch: {
    previewData (news, olds) {
      this.FormData = news
    }
  }
}
</script>

<style scoped lang='css'>
.title{
  font-size: 25px;
  font-weight: 700;
}
</style>
